<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
<div id="app">
    <p>{{message}}</p>
</div>
<script src="https://unpkg.com/vue@2.6.14/dist/vue.js"></script>
<script>
   var vm = new Vue({
    el:'#app',
    data:{message:'hello',age:18},
   });
   //vm.message = 'world'
   /**
    *  Watcher 表示一个观察者，可以观察属性的变化，并在这些属性变化时执行相应的操作
    *  在Vue中，Watcher主要有两个作用 1 依赖收集 2.触发更新
    *  依赖收集：每当我们在模板中使用到了一个变量，或者说读取了一个变量，就会创建一个观察者来观察数据的变量
    *  派发更新 以后当一个响应式数据发生变化的时候，所有观察这个属性的观察者都会得到通知，执行相应的更新操作
    */ 
</script>
</body>
</html>